
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <title>角色权限维护页</title>
  <!-- Tell the browser to be responsive to screen width -->
  <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
  <!-- Bootstrap 3.3.6 -->
  <link rel="stylesheet" href="../css/AdminLTE/bootstrap/css/bootstrap.min.css">
  <!-- Font Awesome -->
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.5.0/css/font-awesome.min.css">
  <!-- Ionicons -->
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/ionicons/2.0.1/css/ionicons.min.css">
  <!-- Theme style -->
  <link rel="stylesheet" href="../css/AdminLTE/dist/css/AdminLTE.min.css">
  <!-- iCheck -->
  <link rel="stylesheet" href="../css/AdminLTE/plugins/iCheck/square/blue.css">
  <style>
  	html{
  		overflow: hidden;
  	}
  	.form-control{
  		height: 44px;
   		margin-bottom: 28px;
  	}
  	.alert{
  		position: absolute;
	    top: 0px;
	    right: 0px;
	    width: 336px;
	    display: none;
  	}
  	.redalert{
  		border-color: #dd4b39;
  	}
  	#successSave{
	position: fixed;
    right: 0px;
    z-index: 10000;
    opacity: 0.8;
    alpha(opacity=70);
    display: none;
    width: 250px;
    top: 47px;
}
	#errorSave{
	position: fixed;
    right: 0px;
    z-index: 10000;
    opacity: 0.8;
    alpha(opacity=70);
    display: none;
    width: 250px;
    top: 47px;
}
	.repeatDiv{margin-left: 40px;}
  </style>

</head>
<body class="hold-transition login-page" ng-app="authority" ng-controller="authorityCtrl">
	<button type="submit" style='z-index:1000;width: 100px;font-size: 16px;position: fixed;top: 20px;right: 40px;' 
	class="btn btn-lg btn-primary btn-block" ng-click = "Exit()">退出</button>
	<div class="alert alert-success alert-dismissible" id="successSave" >
	                <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
	               <h4 style="text-align: center;" > <i class="icon fa fa-check pull-left"></i><span id="alertStr">操作成功！</span></h4>
	        </div>
	        <div class="alert alert-warning alert-dismissible" id="errorSave" >
	                <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
	               <h4 style="text-align: center;" > <i class="icon fa fa-close pull-left"></i><span id="errorStr">操作失败！</span></h4>
	        </div>
	        
	        
	        
	<div style='width: 100%;height:100%;position: relative;'>
			 <section class="content-header" style='position: relative;' > 
			 	<select ng-change='changeEnter()'  style='position: absolute;top: 30px;left: 10%;height: 30px;width: 200px;border: 1px solid #00c0ef;border-radius: 3px;' ng-model = 'enterId' ng-options='enter.id as enter.name for enter in enterprises' >		
			 	</select>
	      <h1 style="text-align:center;margin: 10px 0px 5px 0px;">
	        	角色权限维护页
	      </h1>
	    </section>
			
			<div style='background: transparent;width: 86%;margin: 2% 7%;border-radius: 5px;height: 70%;display:flex;background-color: #ffffff;'>
				
		    	<div style='width: 30%;border: 1px solid #ccc;border-radius: 5px 0px 0px 5px;'>
		    			<div style='width: 100%;height: 90%;overflow: auto;'><!--background-color: #e4eaec;-->
		    					<div ng-click='getAuthority($event,role.id,role.name,role.enterpriseId)' ng-repeat='role in roles' style='cursor: pointer; width: 100%;height: 50px;line-height: 50px;text-indent: 10%;border-bottom: 1px solid #ddd;'>{{role.name}}</div>
		    			</div>
		    			<div style='width: 100%;height: 10%;border-top: 1px solid #CCCCCC;padding: 10px;'>
		    				<button ng-click='openRolemodal()' class="btn btn-primary pull-left" ><i class="fa fa-plus"></i>&nbsp;&nbsp;新增角色</button>
		    				<button style='margin-left: 2%;' class="btn btn-info" ng-click="openUpdateRole()">修改</button>
		          	<button style='margin-left: 2%;' class="btn btn-danger" ng-click="delRole()">删除</button>
		    			</div>
		    	</div>
		    	<div style='width: 70%;border: 1px solid #ccc;border-left: none;border-radius: 0px 5px 5px 0px;background-color: #F8FAFF;'>
		    			<div style='width: 100%;height: 90%;overflow: auto;'>
		    					<div  class='repeatDiv'  ng-repeat="data in datas.children " >
		    							<input  class='checkbox_{{data.parentId}}' id='checkbox_{{data.id}}' ng-click='judgeState($event,data.id,data.parentId,data.level)' type="checkbox" ng-model='data.checked' />
		    							<label  style='padding-left:10px;background-color: #3c8dbc;width: 270px;margin-bottom: 0px;height: 40px;line-height:40px;border-radius: 3px;border: 1px solid #CCCCCC;'>{{data.name}}</label>
		    							<button ng-show=' data.children.length != 0 ' ng-click='modalDiv(data.id)' style='margin-bottom: 4px;' class="btn btn-primary " ><i class="fa fa-plus"></i></button>
		    							
		    							<div style='margin-left: 40px;display: block;' class='repeatDiv_{{data.parentId}}'  ng-repeat="data in data.children" >
		    									<div style='position: relative;display: inline-block;width: 13px;height: 35px;margin-top: -5px;'>
		    										<input style='position: absolute;top: 10px;right: 0px;' class='checkbox_{{data.parentId}}' id='checkbox_{{data.id}}' ng-click='judgeState($event,data.id,data.parentId,data.level)' type="checkbox" ng-model='data.checked' />
		    									</div>
		    									<label style='position:relative;padding-left:10px;background-color: #00c0ef;width: 270px;margin-bottom: -4px;height: 35px;line-height:35px;border-radius: 3px;border: 1px solid #CCCCCC;'>
		    										<span style='height: 30px;display: inline-block;float: left;margin-right: 10px;width: 100px;overflow: hidden;text-overflow:ellipsis;white-space: nowrap;'>{{data.name}}</span>
		    										<span style='height: 30px;display:inline-block;width: 120px;overflow: hidden;text-overflow:ellipsis;white-space: nowrap;' ng-show=" data.description != null && data.description != ''">备注:&nbsp;&nbsp;{{data.description}}</span>
		    										<button ng-show=' data.children.length != 0 ' ng-click='modalDiv(data.id)' style='position: absolute;top: 0px;right: -40px;' class="btn btn-primary " ><i class="fa fa-plus"></i></button>	
		    									</label>
		    									
		    									<div style='margin-left: 40px;display: block;height: 30px;' class='repeatDiv_{{data.parentId}}'    ng-repeat="data in data.children" >
			    									<input class='checkbox_{{data.parentId}}' id='checkbox_{{data.id}}' ng-click='judgeState($event,data.id,data.parentId,data.level)' type="checkbox" ng-model='data.checked' />
			    									<label style='position:relative;padding-left:10px;background-color: #00a65a;width: 270px;margin-bottom: 0px;height: 30px;line-height:30px;border-radius: 3px;border: 1px solid #CCCCCC;'>
			    										<span style='height: 25px;display: inline-block;float: left;margin-right: 10px;width: 100px;overflow: hidden;text-overflow:ellipsis;white-space: nowrap;'>{{data.name}}</span>
		    											<span style='height: 25px;display:inline-block;width: 120px;overflow: hidden;text-overflow:ellipsis;white-space: nowrap;' ng-show=" data.description != null && data.description != ''">备注:&nbsp;&nbsp;{{data.description}}</span>
			    									</label>
			    								</div>
			    								
		    							</div>
		    					</div>
		    				
		    			</div>
		    			<div style='width: 100%;height: 10%;border-top: 1px solid #CCCCCC;padding: 10px;'>
		    				<button ng-click='saveAuthority()' style='margin-left: 2%;background-color: #00a65a;' class="btn btn-info" >保存配置</button>
		    			</div>
		    	</div>
    		 
    </div> 
	</div>
	
	<!-- 模态框 新增角色 -->
<div class="modal fade" id="addRole" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" >
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" style="text-align:center">新增角色名称</h4>
      </div>
      <from>
      <div class="modal-body form-horizontal">
        <div class="box-body">
           	  <div class="form-group">
                        <label for="inputEmail3" class="col-sm-2 control-label">角色名称</label>
                        <div class="col-sm-10">
                            <input type="text" class="form-control" ng-model="roleAddName" ng-blur="judgeShow()" >
                            <span style="color: red;" ng-show="showIt"><i class="fa fa-close"></i>角色名称不能为空</span>
                             <!--<input type="text" class="form-control" placeholder="类别名称" ng-model="categoryName" ng-required="true">-->
                        </div>
                    </div>
         </div>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default btn-lg pull-left" data-dismiss="modal">取消</button>
        <button type="submit" class="btn btn-success btn-lg" ng-click="addRole_true();">确定</button>
      </div>
      </from>
    </div>
  </div>
</div>

<!-- 模态框 修改角色 -->
<div class="modal fade" id="updateRole" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" >
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" style="text-align:center">修改角色名称</h4>
      </div>
      <from>
      <div class="modal-body form-horizontal">
        <div class="box-body">
           	  <div class="form-group">
                        <label for="inputEmail3" class="col-sm-2 control-label">角色名称</label>
                        <div class="col-sm-10">
                            <input type="text" class="form-control" ng-model="roleUpdateName" ng-blur="judgeShow1()" >
                            <span style="color: red;" ng-show="showUpdate"><i class="fa fa-close"></i>角色名称不能为空</span>
                             <!--<input type="text" class="form-control" placeholder="类别名称" ng-model="categoryName" ng-required="true">-->
                        </div>
                    </div>
         </div>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default btn-lg pull-left" data-dismiss="modal">取消</button>
        <button type="submit" class="btn btn-success btn-lg" ng-click="updateRole_true();">确定</button>
      </div>
      </from>
    </div>
  </div>
</div>

<!-- 删除角色 -->
  	<div class="modal fade" id="delRole" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" >
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" style="text-align:center">提示</h4>
      </div>
      <div class="modal-body form-horizontal">
        <div class="box-body">
           	确定要删除<span ng-bind="roleName"></span>吗？
        </div>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default btn-lg pull-left" data-dismiss="modal">取消</button>
        <button type="button" class="btn btn-success btn-lg" ng-click="del_Role(roleId);">确定</button>
      </div>
    </div>
  </div>
</div>
	
<!-- jQuery 2.2.3 -->
<script src="../css/AdminLTE/plugins/jQuery/jquery-2.2.3.min.js"></script>
<script src="../js/validate.js"></script>
<!-- Bootstrap 3.3.6 -->
<script src="../css/AdminLTE/bootstrap/js/bootstrap.min.js"></script>
<!-- Angular -->
<script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>
<script src="http://apps.bdimg.com/libs/angular-route/1.3.13/angular-route.js"></script>
<script src="../js/jquery-ui.js"></script>
<script src="../js/tenantLoginCtrl.js"></script>
</body>
</html>
